*
  padding 0
  margin 0
  font-weight normal
  font-style normal
  font-stretch normal
html 
body 
  width 100%
  height 100%
  font-family 'PingFang-SC-Medium'
  background #f5f5f5
  position relative
  -webkit-text-size-adjust 100%
  -webkit-tap-highlight-color rgba(0, 0, 0, 0)
  .m-root
    width 100%
    height 100%
    .bangding
      background #efeff4
      .header
        overflow hidden
        height 548px
        .out
          margin 0 auto
          margin-top 130px
          width 196px
          height 196px
          padding 13px
          border-radius 50%
          border solid 1px rgba(224, 224, 224, 1)
          box-sizing border-box
          .inner
            width 170px
            height 170px
            border-radius 50%
            background-color rgba(14, 71, 161, 1)
            background url('../image/bangding-head.png') no-repeat
            background-size cover
        .name
          margin 0 auto
          margin-top 30px
          width 128px
          height 29px
          background url('../image/Logo.png') no-repeat
          background-size cover
      .inputs
        .user
        .password
          display block
          width 100%
          height 84px
          border-radius 10px 
          border solid 1px rgba(230, 230, 230, 1)
          padding-left 98px
          line-height 1
          font-size 30px
          box-sizing border-box
          &.user
            background #fff url(../image/bangding-user.png) no-repeat
            background-position 30px 26px
          &.password
            margin-top 30px
            background #fff url(../image/bangding-lock.png) no-repeat
            background-position 30px 26px
        .success
          margin 110px 30px 0 30px
          height 84px
          background-color rgba(14, 71, 161, 1)
          border-radius 10px 10px 10px 10px
          font-size 32px
          font-weight normal
          font-style normal
          font-stretch normal
          line-height 84px
          letter-spacing -1.3px
          color #ffffff
          text-align center
    .m-success
      background #fff
      overflow hidden
      .img
        margin 0 auto
        margin-top 142px
        width 200px
        height 200px
        background url('../image/success.png') no-repeat
        background-size cover
      .title
        margin-top 54px
        span  
          display block
          text-align center
          font-size 34px
          font-weight normal
          font-style normal
          font-stretch normal
          line-height 60px
          letter-spacing 0px
          color #000000
      .goto
        margin-top 49px
        text-align center
        a  
          text-decoration none
          font-size 28px
          line-height 40px
          letter-spacing 0px
          color #576b95
    .m-list
      background #eff2f8
      width 100%
      height 100%
      .menu
        height 88px
        display flex
        background #ffffff
        line-height 88px
        .item
          flex 1
          text-align center
          font-size 28px
          letter-spacing 0px
          color #999999
          -webkit-tap-highlight-color transparent
          &:after
            content '>'
            display inline-block
            font-size 30px
            font-family Consolas, sans-serif
            margin-left  15px
            transform rotate(90deg)
          &.active
            color #0e47a1
            &:after
              transform rotate(-90deg)
      .wrap
        overflow-y auto
        position absolute
        top 108px
        left 0
        bottom 0
        right 0
        -webkit-overflow-scrolling touch
      .positive
        height 155px
        background #fff
        display flex
        .item
          flex 1
          text-align center
          margin-top 43px
          .top
            display inline-block
            text-indent 58px
            height 42px
            font-size 48px
            font-weight bold
            line-height 42px
            color #06b813
            background url('../image/positive-icon0.png') no-repeat
            background-size 42px 42px
          &:nth-child(2)
            .top
              color #0e47a1
              background url('../image/positive-icon1.png') no-repeat
          &:nth-child(3)
            .top
              color #ec4013
              background url('../image/positive-icon2.png') no-repeat
          .desc
            font-size 20px
            color #686a6d
            margin-top 20px
      .newlist
        overflow-x auto
        .item
          position relative 
          border-top 1px solid  rgba(226, 226, 226, 1)
          background #ffffff
          padding 0 30px
          padding-bottom 38px
          .title
            margin-top 39px
            display flex
            .hint
              flex 0 0 50px
              width 50px
              height 50px
              line-height 50px
              text-align center
              font-size 24px
              color #ffffff
              background rgba(66, 201, 76, 1)
              border-radius 50%
              &.moddle
                background #0e4cad
              &.back
                background #fe5722
            .right
              flex 1
              padding-left 12px
              .stitle
                font-size 0
                color #4c4c4c
                line-height 23px
                .from
                .like
                  display inline-block
                  font-size 28px
                  &.like
                    margin-left 18px
              .time
                font-size 22px
                letter-spacing 0px
                line-height 1
                color #4c4c4c
                margin-left 1px
        .name
          margin-top 23px
          font-size 34px
          line-height 36px
          letter-spacing 0px
          color #1a1a1a
          font-weight bold
        .desc
          margin-top 17px
          font-size 30px
          line-height 36px
          letter-spacing 0.8px
          color #3b3b3b
          text-overflow -o-ellipsis-lastline
          overflow hidden
          text-overflow ellipsis
          display -webkit-box
          -webkit-line-clamp 2
          -webkit-box-orient vertical
        .conect
          position absolute
          top 54px
          right 31px
          font-size 24px
          line-height 36px
          color #999999
          background url('../image/conect.png') no-repeat
          background-size 24px 22px
          background-position 0 6px
          text-indent 34px
          &.active
            background url('../image/conect-c.png') no-repeat
            background-size 24px 22px
            background-position 0 6px
      .module1
        -webkit-tap-highlight-color transparent
        display none
        position absolute
        top 88px
        bottom 0
        left 0
        right 0
        background rgba(0, 0, 0, 0.5)
        &:after
          content ''
          width 20px
          height 12px
          background #fff url('../image/arrow.png') no-repeat
          background-size 20px 11px
          position absolute 
          top -10px
          left 16.6%
          transform translateX(-50%)
        .times
          background #fff
          max-height 535px
          overflow auto
          >a   
            text-decoration none
            display block
            height 90px
            border-top 1px solid rgba(232, 232, 232, 1)
            line-height 90px
            font-size 28px
            color #999999
            padding-left 50px
            box-sizing border-box
            -webkit-tap-highlight-color transparent
            &.active
              color #0e47a1
      .module2
        -webkit-tap-highlight-color transparent
        display none
        position absolute
        top 88px
        bottom 0
        left 0
        right 0
        background rgba(0, 0, 0, 0.5)
        &:after
          content ''
          width 20px
          height 12px
          background #fff url('../image/arrow.png') no-repeat
          background-size 20px 11px
          position absolute 
          top -10px
          left 50%
          transform translateX(-50%)
        .types
          background #fff
          display flex
          flex-wrap wrap
          .type
            width 33.3%
            height 209px
            box-sizing border-box
            border-bottom 1px solid rgba(232, 232, 232, 1)
            -webkit-tap-highlight-color transparent
            &:nth-child(-n+3)
              border-top 1px solid rgba(232, 232, 232, 1)
            &:nth-child(3n+1)
            &:nth-child(3n+2)
              border-right 1px solid rgba(232, 232, 232, 1)
            &.active
              background-color: #ecf1f8
            .img
              width 38px
              height 36px
              margin 0 auto
              margin-top 63px
              background url('../image/type-icon0.png') no-repeat
              background-size cover
            &:nth-child(2)
              .img
                width 48px
                height 39px
                background url('../image/type-icon1.png') no-repeat
            &:nth-child(3)
              .img
                width 38px
                height 39px
                background url('../image/type-icon2.png') no-repeat
            &:nth-child(4)
              .img
                width 38px
                height 38px
                background url('../image/type-icon3.png') no-repeat
            &:nth-child(5)
              .img
                width 48px
                height 39px
                background url('../image/type-icon4.png') no-repeat
            &:nth-child(6)
              .img
                width 48px
                height 39px
                background url('../image/type-icon5.png') no-repeat
            &:nth-child(7)
              .img
                width 43px
                height 36px
                background url('../image/type-icon6.png') no-repeat
            &:nth-child(8)
              .img
                width 38px
                height 38px
                background url('../image/type-icon7.png') no-repeat
            &:nth-child(9)
              .img
                width 38px
                height 37px
                background url('../image/type-icon8.png') no-repeat
            &:nth-child(10)
              .img
                width 26px
                height 40px
                background url('../image/type-icon9.png') no-repeat
            .name
              margin-top 50px
              font-size 24px
              line-height 1
              color #545454
              text-align center
      .module3
        display none
        position absolute
        top 88px
        bottom 0
        left 0
        right 0
        background rgba(0, 0, 0, 0.5)
        -webkit-tap-highlight-color transparent
        &:after
          content ''
          width 20px
          height 12px
          background #fff url('../image/arrow.png') no-repeat
          background-size 20px 11px
          position absolute 
          top -10px
          left 84.4%
          transform translateX(-50%)
        .btns
          position relative
          background #fff
          .item
            padding 29px
            border-top 1px solid rgba(232, 232, 232, 1)
            &:last-child
              border-bottom 0
            .name
              line-height 36px
              color #999999
              font-size 24px
            .chose
              font-size 0
              .one
                -webkit-tap-highlight-color transparent
                display inline-block
                vertical-align top
                border solid 1px rgba(204, 204, 204, 1)
                width 215px
                height 66px
                margin-right 20px
                font-size 24px
                color #333333
                line-height 66px
                text-align center
                margin-top 30px
                &:nth-child(3n)
                  margin-right 0
                &.active
                  border 1px solid #0e47a1
                  color #0e47a1
          .ag
            display flex
            border-top 1px solid  rgba(204, 204, 204, 1)
            div
              flex 1
              height 88px
              line-height 88px
              font-size 32px
              color #333333
              text-align center
              -webkit-tap-highlight-color transparent
              &.active
                background #0e47a1
                color #fff
    .m-detail
      padding 30px
      background #fff
      overflow-x auto
      height 100vh
      -webkit-overflow-scrolling touch
      .title
        font-size 48px
        line-height 72px
        color #333333
        font-weight bold
      .key
        font-size 30px
        line-height 72px
        color #333333
      .come
        font-size 24px
        line-height 48px
        color #333333
        span 
          display inline-block
          margin-left 35px
      .time
        font-size 22px
        line-height 48px
        color #999999
      .body
        margin-top 40px
        margin-bottom 180px
        .desc
          font-size 36px
          line-height 58px
          color #333333
        img
          margin 35px 0
      .foot
        position fixed
        background #fff
        bottom 0
        left 0
        width 100vw
        display flex
        padding-top 10px
        >div
          flex 1
          text-align center
          .col
            width 48px
            height 44px
            margin 0 auto
            background url('../image/detail-collect-n.png') no-repeat
            background-size 48px 44px
            &.active
              background url('../image/detail-collect.png') no-repeat
              background-size 48px 44px
          .del
            width 42px
            height 42px
            margin 0 auto
            background url('../image/detail-del.png') no-repeat
            background-size 42px 42px        
          .name
            font-size 26px
            line-height 72px
            color #4d4d4d
              
              




